<%@ page contentType="text/html;charset=UTF-8" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>管理员列表</title>
    <%@ include file="/WEB-INF/pages/commons/head-meta.jsp" %>
    <%@ include file="/WEB-INF/pages/commons/js-meta.jsp" %>
    <style>
        .form-group {
            float: left;
            margin-right: 10px;
        }

    </style>
</head>

<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <%--                <div class="ibox-title">--%>
                <%--                    <h5>管理员--%>
                <%--                        <small>列表</small>--%>
                <%--                    </h5>--%>
                <%--                    <div class="ibox-tools">--%>
                <%--                        <a class="collapse-link" onclick="myRefresh()">--%>
                <%--                            <i class="glyphicon glyphicon-refresh"></i>--%>
                <%--                        </a>--%>
                <%--                        <a class="close-link">--%>
                <%--                            <!-- <i class="fa fa-times"></i> -->--%>
                <%--                        </a>--%>
                <%--                    </div>--%>
                <%--                </div>--%>
                <div class="ibox-content">
                    <div class="panel-body  bg-from pad0B">
                        <form id="submitForm">
                            <div class="form-group">
                                <div class="input-group">
										<span class="input-group-btn">
										</span><input type="text" id="account" name="account" placeholder="账号"
                                                      class="form-control trimInput">
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="input-group">
										<span class="input-group-btn">
										</span><input type="text" id="phone" name="phone" placeholder="电话"
                                                      class="form-control trimInput">
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="search-text-margin-left form-group">
                                    <div class="input-group">
                                        <select id="status" name="status" class="form-control">
                                            <option value="">账号状态</option>
                                            <option value="10">正常</option>
                                            <option value="20">禁用</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group">
                                <a id="search" class="btn btn-primary btn-outline ">搜索</a>
                                <a id="reset" class="btn  btn-primary btn-outline ">重置</a>
                            </div>
                        </form>
                    </div>
                    <div class="panel-body  bg-from pad0B listLine">
                        <div class="form-group">
                            <shiro:hasPermission name="admin:add">
                                <button title="新增用户" class="btn btn-primary newTab"
                                        data-url="${ctx }/manager/admin/go/add">新增
                                </button>
                            </shiro:hasPermission>
                        </div>
                    </div>
                    <div class="table-div relative">
                        <table class="table table-striped table-bordered table-hover datatable">
                            <thead>
                            <tr>
                                <th width="290px">账号</th>
                                <th>角色</th>
                                <th>联系电话</th>
                                <th>状态</th>
                                <th>操作</th>
                            </tr>
                            </thead>
                            <tbody>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
    var datatable;
    var condJsonData = {
        account: '',
        status: '',
        phone: '',
    };
    $(function () {
        loadData(condJsonData);
    })
    //搜索
    $('#search').click(function () {
        condJsonData['account'] = $("#account").val();
        condJsonData['phone'] = $("#phone").val();
        condJsonData['status'] = $("#status").val();
        loadData(condJsonData);
    });
    //重置
    $("#reset").click(function () {
        condJsonData['account'] = "";
        condJsonData['phone'] = "";
        condJsonData['status'] = "";
        $("#phone").val("");
        $("#account").val("");
        $("#status").val("");
        loadData(condJsonData);
    });

    function loadData(condJsonData) {
        if (datatable) {
            datatable.destroy();
        }
        var objIndex = layer.load(0, {time: 5 * 1000});
        datatable = $('.datatable').DataTable({
            "bLengthChange": false,//去掉每页多少条框体
            "bFilter": false,
            "serverSide": true,
            "processing": false,
            "lengthMenu": [30, 50, 100, 300],
            "pagingType": "full_numbers",
            "fnDrawCallback": function () {
                layer.close(objIndex);
                $("#DataTables_Table_0_info").append(" 跳转到第 <input type='text' id='changePage' class='input-text' style='width:50px;height:27px;'> 页<input type='button' class='btn btn-info' id='jump' value='go'> ");
                var oTable = $(".datatable").dataTable();
                var redirectPage = 0;
                $('#jump').bind("click", function () {
                    if ($("#changePage").val() && $("#changePage").val() > 0) {
                        redirectPage = $("#changePage").val() - 1;
                    }
                    oTable.fnPageChange(redirectPage);
                });
            },
            "ajax": {
                "async": true,
                "url": ctx + "/admin/admin/search",
                "type": "post",
                "data": condJsonData,
            },
            "ordering": false,
            "columns": [
                {"data": "account"},
                {"data": "roleId"},
                {"data": "phone"},
                {"data": "status"},
                {
                    "data": "id",
                    "fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
                        var html = '<div>';
                        html += '<a title = "编辑管理员" class = "dataTableBtn btn btn-info newTab"  data-url="/admin/admin/go/modify?id=' + sData + '">编辑</a>'
                        html += ' <a title ="删除" class="btn btn-danger" onclick="del(this);" style="margin-left: 10px"  data-id="' + sData + '" >删除</a>'
                        html += '<a title ="重置密码" class="btn btn-danger" onclick="rePassword(this);" style="margin-left: 10px" data-id="' + sData + '" >重置密码</a>';
                        if (oData.status == 20) {
                            html += '<a title ="激活" class = "btn  dataTableBtn btn btn-info" style="margin-left: 10px" onclick = "updateStatus(this);" status="' + oData.status + '" data-id="' + sData + '">激活</a>';
                        } else {
                            html += '<a title ="禁用" class = "btn  dataTableBtn btn btn-danger" style="margin-left: 10px" onclick = "updateStatus(this);" status="' + oData.status + '" data-id="' + sData + '">禁用</a>';
                        }
                        html += "</div>";
                        $(nTd).html(html);
                    }
                }
            ]
        });

    }

    //删除-已完成
    function del(_this) {
        var id = $(_this).attr('data-id');
        layer.confirm("确认删除吗？", {skin: 'layui-layer-molv', title: '系统提示'}, function (layero, index) {
            $.ajax({
                url: ctx + "/admin/admin/delete",
                type: 'post',
                dataType: 'json',
                data: {
                    id: id
                },
                success: function (data) {
                    $(".ui-button").removeAttr("disabled");
                    if (data.success) {
                        layer.msg("删除成功!");
                        loadData();
                    } else {
                        layer.msg(data.info);
                    }
                },
                error: function (data) {
                    $(".ui-button").removeAttr("disabled");
                    layer.msg(data.info);
                }
            });
        })
    }

    //修改管理员状态
    function updateStatus(_this) {
        var id = $(_this).attr('data-id');
        var status = $(_this).attr('status');
        var str = "激活";
        if (status == 10) {
            status = 20;
            str = "禁用"
        } else {
            status = 10;
        }
        layer.confirm("确认要" + str + "吗？", {skin: 'layui-layer-molv', title: '系统提示'}, function () {
            $.ajax({
                url: ctx + "/admin/admin/modify-status",
                type: 'post',
                dataType: 'json',
                data: {
                    id: id,
                    status: status
                },
                success: function (data) {
                    $(".ui-button").removeAttr("disabled");
                    if (data.success) {
                        layer.msg("操作成功!");
                    } else {
                        layer.msg(data.info);
                    }
                    datatable.draw(false);
                },
                error: function (data) {
                    $(".ui-button").removeAttr("disabled");
                    layer.msg(data.info);
                }
            });
        })
    }

    //重置密码
    function rePassword(_this) {
        var id = $(_this).attr('data-id');
        layer.confirm("确认要重置密码？", {skin: 'layui-layer-molv', title: '系统提示'}, function () {
            $.ajax({
                url: ctx + "/admin/admin/reset",
                type: 'post',
                dataType: 'json',
                data: {
                    id: id
                },
                success: function (data) {
                    $(".ui-button").removeAttr("disabled");
                    if (data.success) {
                        layer.msg("重置系统用户密码成功!");
                        loadData();
                    } else {
                        layer.msg(data.info);
                    }
                },
                error: function (data) {
                    $(".ui-button").removeAttr("disabled");
                    layer.msg(data.info);
                }
            });
        })
    }

    function goList() {
        location.href = ctx + '/admin/admin/go/list';
    }

    function myRefresh() {
        window.location.reload();
    }
</script>

</body>

</html>
